
// 导入模板文件
import render from './index.art';

// 导入请求接口方法
import { reqUserList, reqLogout,deleteUser,reqLoginUser } from '../../api/index';

// 导入user获取方法
import { getUser,removeToken,removeUser } from '../../utils/storageUtils';


// 获取对应页码的数据
let appBox = document.getElementById('app');
async function initUsersPage(page, limit = 5) {
    let result = await reqUserList(page, limit);

    // 获取登录用户的信息 - 数据库 - localstorage

    if (result.code === 2000) {
        // 渲染数据
        let { users, total } = result.data;

        let { username } = getUser();

        // 获取登录用户信息
        // let loginUser = await reqLoginUser();

        // 解构登录用户的username
        // let {username} = loginUser.data;

        //console.log(username);

        //获取总页数
        let count = Math.ceil(total / limit);

        // 渲染模板文件
        appBox.innerHTML = render({ username, users, count, page });

        // 给退出登录加事件
        logOutFn()

        // 添加删除事件
        deleteBtnFn(page);

        // 添加修改用户事件
        updateUserFn();
    }
    // console.log(result); 
}

// 暴露给模板使用
window.initUsersPage = initUsersPage;

// 初始化数据
initUsersPage(1);


function logOutFn(){
     // 退出登录按钮事件监听
    document.getElementById('logoutBtn').onclick = async function () {
        await reqLogout();

        // 1. 删除token
        removeToken();

        // 2. 删除user
        removeUser();
        // 3. 跳转到登录页

        window.location = '/login.html';

        console.log('退出成功');
    }
}

function deleteBtnFn(page){
    // deleteBtn 一组元素
    let btns = document.querySelectorAll('.deleteBtn');

    btns.forEach(ele => {
        ele.onclick =async function(){

            // console.log(this.dataset._id);

            // alert('ok');
            if(confirm('确定删除吗')){
               await deleteUser(this.dataset._id)


                initUsersPage(page);
            //    window.location = '/users.html'
            }
        }
    });

}

 function updateUserFn(){
    // 获取修改按钮
    let btns = document.querySelectorAll('.updataBtn');

    btns.forEach(item=>{
        item.onclick =async function(e){
            // 获取下一个兄弟节点
            let nextEle = e.target.nextElementSibling;

            let id = nextEle.dataset._id;
            

            // console.log(id)
            window.location = '/userUpdate.html?id='+id;

        }
    })

    
}